<template>
	<view class="content" >
		<view class="top"></view>
		<view class="banner">
			<dl>
				<dt><image src="../../static/img/common/logo.jpg" mode=""></image></dt>
				<dd>金钻交易</dd>
			</dl>
			<view class="img">
				<image :src="code_url" mode=""></image>
			</view>
			<view class="tgtit">推广链接：
			<rich-text class="tugurl">{{agent_url}}</rich-text></view>
			<view class="sharbuttn">
				<view class="btn" @click="savecode">保存二维码</view>
				<view class="btn" @click="sharurl">复制推广链接</view>
			</view>
			
			<!-- <button class="btn" @click="share">分享</button> -->
			<!-- <view class="shartitle"><view>分享</view></view>
			<view class="sharapk" @click="share">
				<view><image src="../../static/img/weact.png"></image></view>
				<view><image src="../../static/img/shar.png"></image></view>
				<view><image src="../../static/img/qq.png"></image></view>
			</view>
			<view class="bottom">
				<ul>
					<li>1、好友识别二维码通过手机号进行注册</li>
					<li>2、也可分享此页面到微信或QQ邀请好友注册</li>
					<li>3、注册完成后您即可得到相应的奖励</li>
				</ul>
			</view> -->
		</view>
		<view>
			<show-modal></show-modal>
		</view>
	</view>
</template>

<script>
	export default {
		data(){
			return {
				providerList:[],				
				sourceLink: '',		
				type:0,
				foxtoken:'',
				user_key:'',
				agent_url:'',
				userinfo:[],
				code_url:''
			}
		},
		onLoad() {
			this.version = plus.runtime.version;
			let info = this.service.getfox();
			if(info[0]){
				this.foxtoken = info[0]['foxtoken'];
				uni.request({
					url: this.service.FOX_URL + 'diamond/get_userinfo_agent',
					method:'POST',
					data: {
						user_key: this.foxtoken
					},
					dataType:'json',
					header:{
						'content-type':'application/x-www-form-urlencoded',
					},
					success: res => {
						// var rest = JSON.stringify(res);
						// console.log(res)
						var rest = res.data;
						if(rest.status == 'success'){
							this.userinfo = rest.msg;
							this.agent_url = this.userinfo['agent_url'];
							this.sourceLink = this.userinfo['agent_url'];
							this.code_url = this.userinfo['code_url'];
						}
					}
				})
			}else{
				uni.reLaunch({
					url:'../logon/login'
				})
			}
			uni.getProvider({
				service: 'share',
				success: (e) => {
					let data = [];
					for (let i = 0; i < e.provider.length; i++) {
						switch (e.provider[i]) {
							case 'weixin':
								data.push({
									name: '分享到微信好友',
									id: 'weixin'
								})
								data.push({
									name: '分享到微信朋友圈',
									id: 'weixin',
									type: 'WXSenceTimeline'
								})
								break;
							case 'qq':
								data.push({
									name: '分享到QQ',
									id: 'qq'
								})
								break;
							default:
								break;
						}
					}
					this.providerList = data;
				},
				fail: (e) => {
					console.log('获取登录通道失败'+ JSON.stringify(e));
				}
			});
		},
		methods:{
			
			//复制分享链接
			sharurl(){
				uni.setClipboardData({
					data: this.agent_url,
					success: function () {
						console.log('success');
						this.$showModal({
							title: '复制成功',
							content: '内容已复制到粘贴板，可前往其他应用粘贴查看。', 
							showCancel:false,
							success: function(res) {
								if (res.confirm) {											 
									//console.log('用户点击确定');
								} else if (res.cancel) {
									//console.log('用户点击取消');
								}
							}
						});
					}
				});
			},
			//保存图片到相册
			savecode(){
				if(this.code_url.length > 0){
					uni.showActionSheet({
						itemList:['保存图片到相册'],
						success: () => {
							plus.gallery.save(this.code_url, function() {
								uni.showToast({
									title:'保存成功',
									icon:'none'
								})
							}, function() {
								uni.showToast({
									title:'保存失败，请重试！',
									icon:'none'
								})
							});
						}
					})
				}else{
					this.$showModal({
						title: '没有找到图片!',
						showCancel: false
					})
				}
				
			},
			share(e) {
				if (this.providerList.length === 0) {
					this.$showModal({
						title: '当前环境无分享渠道!',
						showCancel: false
					})
					return;
				}
				let itemList = this.providerList.map(function (value) {
					return value.name
				})
				 
				console.log(itemList)
				
				uni.showActionSheet({
					itemList: itemList,
					success: (res) => {
						console.log(this.providerList[res.tapIndex].id)
						if(this.providerList[res.tapIndex].id=='qq'){
							this.type=1
						}else{
							this.type=0
						}
						 uni.share({
						 	provider: this.providerList[res.tapIndex].id,
						 	scene: this.providerList[res.tapIndex].type && this.providerList[res.tapIndex].type === 'WXSenceTimeline' ? 'WXSenceTimeline' : "WXSceneSession",
						 	type: this.type,
						 	title:'金钻交易',
						 	summary: '月入百万，躺着赚钱',
						 	imageUrl:this.code_url,
						 	href:this.agent_url,
						 	success: (res) => {
						 		console.log("success:" + JSON.stringify(res));
						 	},
						 	fail: (e) => {
						 		this.$showModal({
						 			content: e.errMsg,
						 			showCancel:false
						 		})
						 	}
						 });
					}
				})
				
				
				
			 
			},
			openLink() {
				plus.runtime.openWeb(this.sourceLink)
			}
		}
	}
	
	
</script>

<style>
	.tugurl{
		color: #999;
	}
	.sharbuttn{
		display: flex;
		justify-content: center;
	}
	.shartitle{
		    width: 80%;
			text-align: center;
			margin-left: 10%;
			border-bottom: 1px solid #dddddd;
			position: relative;
			height: 60upx;
	}
	.tgtit{
		text-align: center;
	}
	.shartitle view{
		    height: 50upx;
			line-height: 50upx;
			font-size: 28upx;
			color: #999;
			width: 120upx;
			margin: 32upx auto;
			position: absolute;
			background: #fff;
			left: 50%;
			margin-left: -60upx;
	}
	.sharapk{
	 display: flex;
	 justify-content: center;
	 margin: 20upx auto
	}
	.sharapk view{
		margin: 40upx;
	}
	.sharapk view image{
		height: 80upx;
		width: 80upx;
	}
	.content{
		width: 100%;
		background-color: #ffffff;
	}
	.top{
		width: 100%;
		height:100upx;
		background: #0084FF ;
		background-size:100% ;
		background-position:center center;
	}
	.banner{
		width: 100% ;
		background-color: #FFFFFF;
		border-radius: 60upx 60upx 0 0;
		margin-top: -60upx;
	}
	.banner dl{
		margin-top: -10upx;
	}
	.banner dl dt{
		text-align: center;
	}
	.banner dl dt image{
		width: 160upx;
		height: 160upx;
		border-radius:50% ;
	}
	.banner dl dd{
		text-align: center;
	}
	.img{
		width: 400upx;
		height: 400upx;
		background-color: #0E80D2;
		margin: 0 auto;
	}
	.img image{
		width: 100%;
		height: 100%;
	}
	.btn{
		width: 260upx;
		height: 60upx;
		line-height: 60upx;
		margin: 0 auto;
		margin-top: 60upx;
		border-radius: 40upx;
		border: 0;
		font-size: 26upx;
		outline: 0;
		background: #33b17b;
		color: #FFFFFF;
		text-align: center;
	}
	.bottom{
		width: 100%;
		height: 400upx;
		background-position:left bottom;/* 设置背景图片位置 */
		background-size: 20%;
	}
	.bottom ul{
		padding-left: 40upx;
		box-sizing: border-box;
	}
	.bottom ul li{
		width: 100%;
		height: 60upx;
	}
</style>
